<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core">


   
    <f:metadata>
        <f:viewParam name="marker" value="#{ratingBean.code}"/>
    </f:metadata> 
    
    <h:head>

        <title>ShuckApp >> Comentarios</title>
        <link rel="stylesheet" type="text/css" href="/Shuckapp/recursos/css/estilos.css" />

    </h:head>

    <h:body>

        <p:graphicImage value="/recursos/imagenes/logo_shuckapp.png" width="200px"  height="100px"/>

        <h:form id="fr_menu">
            <p:panel  styleClass="cuerpo">

          
                <p:stack icon="/recursos/imagenes/icon_menu.png" expanded="true" closeSpeed="30" id="menu">
                    <c:forEach items="#{bmenuInicio.menus}" var="link">
                        <p:menuitem  value="#{link.titulo}"  url="#{link.outcome} "  icon="#{link.icon}"    />  
                    </c:forEach>

                </p:stack>
                <p:draggable for="menu"  /> 

            </p:panel>
        </h:form>
        <br/>
        <br/>
        <br/>
        
        <h:form style="width:65%">  
            
            <p:growl id="msgs" showDetail="true" />

            <p:panel header="Comentarios" style="margin-bottom:10px;">
            
                <h:panelGrid columns="2">
                    <p:outputLabel for="restaurant" value="Puesto: " />
                    <p:selectOneMenu id="restaurant" value="#{ratingBean.restaurant}" style="margin-right:10px">   
                        <p:ajax listener="#{ratingBean.onRestaurantChange}" update="average table panel_rating" />
                        <f:selectItems value="#{ratingBean.restaurants}" />
                    </p:selectOneMenu>
                </h:panelGrid>


                <h:panelGrid columns="2" id="panel_rating">  
                    <h:outputText value="Cuantas estrellas le das: " />  
                    <p:rating value="#{ratingBean.rating}" />  
                </h:panelGrid>  
                
                <p:inputText label="comentario" id="comment" required="true" 
                             requiredMessage="Debes escribir un comentario" value="#{ratingBean.comment}" size="20"/>
                <p:watermark for="comment" value="Comentario"/>    

                <p:commandButton value="Calificar" style="margin:5px"  
                                 icon="ui-icon-check" action="#{ratingBean.annotate}" 
                                 update="panel_rating comment average table"/>  

                <p:separator />

                <h3>Comentarios previos</h3>  
                
                <h:panelGrid columns="2" id="average">  
                    <h:outputText value="Promedio: "/>  
                    <p:rating value="#{ratingBean.average}" disabled="true"/>  
                </h:panelGrid>  

                <p:dataTable var="rating" value="#{ratingBean.ratings}" id="table">
                    <p:column headerText="Calificación" style="width:80px">
                        <p:rating value="#{rating.score}" disabled="true"/>
                    </p:column>

                    <p:column headerText="Comentario">
                        <h:outputText value="#{rating.comment}" />
                    </p:column>

                </p:dataTable> 
            </p:panel>
        </h:form>        
        
    </h:body>

</html>
